<!--
  ~
  ~
  ~ MIT License
  ~
  ~ Copyright (c) 2021 gngpp
  ~
  ~ Permission is hereby granted, free of charge, to any person obtaining a copy
  ~ of this software and associated documentation files (the "Software"), to deal
  ~ in the Software without restriction, including without limitation the rights
  ~ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  ~ copies of the Software, and to permit persons to whom the Software is
  ~ furnished to do so, subject to the following conditions:
  ~
  ~ The above copyright notice and this permission notice shall be included in all
  ~ copies or substantial portions of the Software.
  ~
  ~ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  ~ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  ~ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  ~ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  ~ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  ~ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  ~ SOFTWARE.
  -->

<!DOCTYPE html>
<!-- saved from url=(0039)https://v3.bootcss.com/examples/signin/ -->
<html lang="zh-CN"><head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type">

    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta content="" name="description">
    <meta content="" name="author">
    <link href="" rel="shortcut icon" type="image/x-icon">
    <link href="https://getbootstrap.com/docs/3.4/examples/signin/" rel="canonical">

    <title>LOGIN</title>

    <!-- Bootstrap core CSS -->
    <link href="/login_files/bootstrap.min.css" rel="stylesheet">

    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <link href="/login_files/ie10-viewport-bug-workaround.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="/login_files/signin.css" rel="stylesheet">

    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]><script src="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.10/assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="/login_files/ie-emulation-modes-warning.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>

  <body _c_t_common="1">

  <div class="container">

      <form class="form-signin" name="form">
          <h2 align="center" class="form-signin-heading">Please sign in</h2>
          <label class="sr-only" for="username">Username</label>
          <input autofocus="" class="form-control" id="username" name="username" placeholder="Username" required=""
                 type="text">
          <label class="sr-only" for="password">Password</label>
          <input class="form-control" id="password" name="password" placeholder="Password" required="" type="password">
          <button class="btn btn-lg btn-primary btn-block" id="signIn" onclick="submitForm()" type="button">Sign in
          </button>
      </form>

  </div> <!-- /container -->


  <!--    Axios-->
  <script src="/js/axios.min.js"></script>
  <!--    RSA-->
  <script src="/js/jsencrypt.js"></script>
  <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
  <script src="/login_files/ie10-viewport-bug-workaround.js"></script>

  <script th:inline="javascript">
      const publicKey = [[${rsaPublicKey}]];
      let axiosInstance = axios.create()
      // 添加响应拦截器
      axiosInstance.interceptors.response.use(function (response) {
          // 对响应数据做点什么
          return response;
      }, function (error) {
          // 对响应错误做点什么
          alert(error.response.data.errMsg)
          return Promise.reject(error);
      });

      function submitForm() {
          const username = document.getElementById("username").value;
          const password = document.getElementById("password").value;
          let form = new FormData()
          form.append("username", encryptRSA(username))
          form.append("password", encryptRSA(password))
          const options = {
              method: 'POST',
              headers: {'content-type': 'application/x-www-form-urlencoded'},
              data: form,
              url: "/login"
          };
          axiosInstance(options)
              .then(res => {
                  window.location.href = res.request.responseURL
              })

      }

      function encryptRSA(txt) {
          const encrypt = new JSEncrypt()
          // 设置公钥
          encrypt.setPublicKey(publicKey)
          // 对需要加密的数据进行加密
          return encrypt.encrypt(txt)
      }
  </script>
  <audio controls="controls" style="display: none;"></audio>
  </body>
<style type="text/css">#yddContainer {
    display: block;
    font-family: Microsoft YaHei;
    position: relative;
    width: 100%;
    height: 100%;
    top: -4px;
    left: -4px;
    font-size: 12px;
    border: 1px solid
}

#yddTop {
    display: block;
    height: 22px
}

#yddTopBorderlr {
    display: block;
    position: static;
    height: 17px;
    padding: 2px 28px;
    line-height: 17px;
    font-size: 12px;
    color: #5079bb;
    font-weight: bold;
    border-style: none solid;
    border-width: 1px
}

#yddTopBorderlr .ydd-sp {
    position: absolute;
    top: 2px;
    height: 0;
    overflow: hidden
}

.ydd-icon {
    left: 5px;
    width: 17px;
    padding: 0px 0px 0px 0px;
    padding-top: 17px;
    background-position: -16px -44px
}

.ydd-close {
    right: 5px;
    width: 16px;
    padding-top: 16px;
    background-position: left -44px
}

#yddKeyTitle {
    float: left;
    text-decoration: none
}

#yddMiddle {
    display: block;
    margin-bottom: 10px
}

.ydd-tabs {
    display: block;
    margin: 5px 0;
    padding: 0 5px;
    height: 18px;
    border-bottom: 1px solid
}

.ydd-tab {
    display: block;
    float: left;
    height: 18px;
    margin: 0 5px -1px 0;
    padding: 0 4px;
    line-height: 18px;
    border: 1px solid;
    border-bottom: none
}

.ydd-trans-container {
    display: block;
    line-height: 160%
}

.ydd-trans-container a {
    text-decoration: none;
}

#yddBottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 22px;
    line-height: 22px;
    overflow: hidden;
    background-position: left -22px
}

.ydd-padding010 {
    padding: 0 10px
}

#yddWrapper {
    color: #252525;
    z-index: 10001;
    background: url(chrome-extension://eopjamdnofihpioajgfdikhhbobonhbb/ab20.png);
}

#yddContainer {
    background: #fff;
    border-color: #4b7598
}

#yddTopBorderlr {
    border-color: #f0f8fc
}

#yddWrapper .ydd-sp {
    background-image: url(chrome-extension://eopjamdnofihpioajgfdikhhbobonhbb/ydd-sprite.png)
}

#yddWrapper a, #yddWrapper a:hover, #yddWrapper a:visited {
    color: #50799b
}

#yddWrapper .ydd-tabs {
    color: #959595
}

.ydd-tabs, .ydd-tab {
    background: #fff;
    border-color: #d5e7f3
}

#yddBottom {
    color: #363636
}

#yddWrapper {
    min-width: 250px;
    max-width: 400px;
}</style>
</html>
